<?php include('header.php');?>
<div class="container-fluid">
	<div class="row-fluid">
		<div class="span 12">
			<h1>ADMIN</h1>
		</div>
	</div>
	<div class="row-fluid">
		<div class="span2"">
			<?php include('lefter.php');?>
		</div>
		<div class="span10">
			<div class="row-fluid">
				<div class="span8">
					<h3>
						<span>CATEGORY</span>
					</h3>
				</div>
				<div class="span4">
					<div class="btn-group btn-limit pull-right" data-toggle="buttons-radio">
						<button type="button" class="btn<?php if($limit == 10) :?> active<?php endif;?>">
							<i class="icon-resize-vertical"></i>10
						</button>
						<button type="button" class="btn<?php if($limit == 20) :?> active<?php endif;?>">
							<i class="icon-resize-vertical"></i>20
						</button>
						<button type="button" class="btn<?php if($limit == 50) :?> active<?php endif;?>">
							<i class="icon-resize-vertical"></i>50
						</button>
					</div>
				</div>
			</div>
			<hr />
			<div class="ul-table category">
				<ul class="header">
					<li class="no">NO</li>
					<li class="title">TITLE</li>
					<li class="delete">DELETE</li>
				</ul>
			</div>
			<div class="ul-table ul-table-body category sortable">
			<?php foreach($category_rows as $row) :?>
				<ul>
					<li class="no"><?=$row['id']?></li>
					<li class="title"><a href="#view" data-toggle="modal"><?=$row['title']?></a></li>
					<li class="delete"><button type="button" class="btn btn-small btn-danger btn-delete">Delete</button></li>
				</ul>
			<?php endforeach;?>
			</div>
			<div id="view" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="view_label" aria-hidden="true">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
					<h3 id="view_label"></h3>
				</div>
				<div class="modal-body">
					<form id="view_form" class="form-horizontal" method="post" enctype="multipart/form-data">
					<input type="hidden" name="id" />
					<input type="hidden" name="limit" value="<?=$limit?>" />
					<input type="hidden" name="offset" value="<?=$offset?>" />
					<div class="control-group">
						<label class="control-label" for="title"><strong>제 목</strong></label>
						<div class="controls">
							<input type="text" name="title" id="title" />
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
					<button class="btn btn-primary">Save</button>
					</form>
				</div>
			</div>
			<div class="pagination pagination-centered">
				<ul>
					<?=$pagination_links?>
				</ul>
			</div>
			<div class="row-fluid">
				<div class="span4 offset8">
					<div class="pull-right">
					<button type="button" class="btn btn-sort hidden-phone">Save sort</button>
					<button type="button" class="btn btn-primary btn-write">Write</button>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script src="<?=JS_DIR?>/jquery-1.8.3.min.js"></script>
<script src="<?=BS_DIR?>/admin/js/bootstrap.min.js"></script>
<script src="<?=JU_DIR?>/js/jquery-ui-1.9.2.custom.min.js"></script>
<script>
var sort_array = [<?=$sort_string?>];

$(function() {
	$("div.btn-limit button").click(function() {
		location.href = "<?=base_url(CONTROLLER.'/'.METHOD)?>/"+$(this).text()+"/";
	});
	$("div.sortable").sortable();
    $("div.sortable").disableSelection();
	$("a[data-toggle='modal']").click(function() {
		$("#view_form").attr("action", "<?=base_url('admin/blog_category_edit_action')?>");
		var id = $(this).parent().parent().children("li.no").text();
		$("#view_form input[name='id']").val(id);
		$.ajax({
			type: 'post',
			url: "<?=base_url('admin/blog_category_view')?>",
			data: { 
				id: id
			},
			success: function(data){
				$("#view_label").html("EDIT <small>"+data.register_date+"</small>");
				$("#title").val(data.title);
			},
			error: function(jqXHR, textStatus, errorThrown){
				alert( errorThrown );
			}
		});
	});
	$("button.btn-write").click(function() {
		$("#view_label").text("WRITE");
		$("#view_form").attr("action", "<?=base_url('admin/blog_category_write_action')?>");
		$('#view').modal('show');
	});
	$("#view").on("hidden", function() {
		$("#view_form")[0].reset();
	});
	$("#view_form").on("submit", function() {
		if(!$("#title").val()) {
			alert("제목을 입력해 주세요");
			$("#title").focus();
			return false;
		}
	});
	$("button.btn-sort").click(function() {
		var id_sort_array = [];
		var div_ul_object = $("div.sortable").children("ul");
		i = 0;
		$.each(div_ul_object, function() {
			id_sort_array.push({id: $(this).children("li.no").text(), sort: sort_array[i]});
			i++;
		});
		$.ajax({
			type: 'post',
			url: "<?=base_url('admin/blog_category_sort_action')?>",
			data: { 
				id_sort_array: id_sort_array
			},
			success: function(data){
				alert('Sort saved!');
			},
			error: function(jqXHR, textStatus, errorThrown){
				alert( errorThrown );
			}
		});
    });
	$("button.btn-delete").click(function() {
		if(confirm('Delete?')) {
			var id = $(this).parent().parent().children("li.no").text();
			$.ajax({
				type: 'post',
				url: "<?=base_url('admin/blog_category_delete_action')?>",
				data: { 
					id: id
				},
				success: function(data){
					location.href = "<?=base_url('admin/blog_category/'.$limit.'/'.$offset)?>";
				},
				error: function(jqXHR, textStatus, errorThrown){
					alert( errorThrown );
				}
			});
		}
	});
});
</script>
<?php include('footer.php');?>